<template>
    <div class="formmain-wrapper">
        <h1>总览</h1>
        <main>
            <div class="card">
                <div><span>本周完成任务</span><p>{{1}}</p></div>
                <div class="middle"><span>本周驳回任务</span><p>{{2}}</p></div>
                <div><span>我的代办</span><p>{{3}}</p></div>
            </div>
            <div class="main-content">
                <li></li>
            </div>
        </main>
    </div>
</template>

<script lang="ts" setup>

</script>

<style scoped lang="scss">
.formmain-wrapper{
    height: 100%;
    width: 100%;
    overflow: auto;
    h1 {
        width: auto;
        height: 60px;
        background: #ffffff;
        line-height: 60px;
        text-align: left;
        padding-left: 20px;
        font-weight: 700;
        font-size: 20px;
    }
    main{
        margin: 10px 10px 10px 10px;
        width: calc(100% - 20px);
        .card{
            background: #ffffff;
            box-sizing: content-box;
            height: 66px;
            padding: 24px;
            display: grid;
            margin-bottom: 10px;
            grid-template-columns: 1fr 1fr 1fr;
            p{
                font-size: 24px;
                line-height: 32px;
                color: rgba(0, 0, 0, 0.85);
            }
            .middle{
                border-right: 1px dashed #a6a5a5;
                border-left: 1px dashed #a6a5a5;
            }
        }
        .main-content{
            background: #ffffff;
        }
    }
}


</style>
